<template>
  <div>

    <el-row :gutter="20" style="width: 99%; margin: auto;">
      <el-col :span="15">
        <div class="grid-content bg-purple">
          <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="true" label-width="68px">
            <el-form-item label="挂号编号" prop="registerId">
              <el-input v-model="registerId" placeholder="请输入挂号编号" clearable />
            </el-form-item>
            <el-form-item>
              <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery2">搜索</el-button>
            </el-form-item>
            <el-form-item label="身份证" prop="patientCardId">
              <el-input v-model="patientCardId" placeholder="请输入身份证" clearable />
            </el-form-item>
            <el-form-item>
              <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
            </el-form-item>
          </el-form>

          <!-- 显示挂号信息 -->
          <el-card v-if="cardFlag" style="margin: 20px auto; width: 85%;">
            <el-descriptions title="挂号信息">
              <el-descriptions-item label="挂号id">{{ register.registerId }}</el-descriptions-item>
              <el-descriptions-item label="患者姓名">{{ register.patientName }}</el-descriptions-item>
              <el-descriptions-item label="挂号科室">{{ register.depName }}</el-descriptions-item>
              <el-descriptions-item label="状态">{{ register.registerState == 0 ? '未完成' : '已完成' }}</el-descriptions-item>
              <el-descriptions-item label="挂号时间">{{ register.registerDate }}</el-descriptions-item>
              <el-descriptions-item label="备注">{{ register.remark }}</el-descriptions-item>
              <el-descriptions-item>
                <el-button type="success" size="small" @click="addChufang">开处方</el-button>
              </el-descriptions-item>
              <el-descriptions-item>
                <el-button type="success" size="small" @click="endRegister">结束挂号单</el-button>
              </el-descriptions-item>
              <el-descriptions-item>
                <el-button type="success" size="small" @click="zhuYuan">住院</el-button>
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </div>
      </el-col>
      <el-col :span="9">
        <div class="grid-content bg-purple">
          <el-card>
            <el-table :data="registerList">
              <el-table-column label="挂号编号" align="center" prop="registerId" />
              <el-table-column label="医生姓名" align="center" prop="userName" />
              <el-table-column label="患者姓名" align="center" prop="patientName" />
              <!-- <el-table-column label="患者身份证" align="center" prop="patientCardId" /> -->
              <el-table-column label="挂号时间" align="center" prop="registerDate"></el-table-column>
              <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
                <template slot-scope="scope">
                  <el-button size="mini" type="text" icon="el-icon-edit" @click="guoHao(scope.row.registerId)">过号
                  </el-button>
                  <el-button size="mini" type="text" icon="el-icon-delete" @click="endRegister2(scope.row.registerId)">
                    删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-card>
        </div>
      </el-col>
    </el-row>

    <!-- 开处方对话框 -->
    <el-dialog title="开处方" :visible.sync="chufangDialogFormVisible" style="width: 70%; margin: auto;">
      <el-form :model="prescription">
        <el-form-item label="处方药" prop="rpMedicine">
          <el-input v-model="prescription.rpMedicine" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-form-item label="检查项目" prop="rpInspect">
          <el-input v-model="prescription.rpInspect" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-form-item label="诊断意见" prop="diagnosis">
          <el-input v-model="prescription.diagnosis" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input v-model="prescription.remark" type="textarea" placeholder="请输入内容" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="chufangDialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="insertPrescription()">确 定</el-button>
      </div>
    </el-dialog>

    <!-- 简历病历对话框 -->
    <el-dialog title="病历档案" :visible.sync="recordDialogFormVisible" style="width: 70%; margin: auto;">
      <el-form :model="prescription">
        <el-form-item label="病情简述" prop="recordDesc">
          <el-input v-model="record.recordDesc" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-form-item label="健康状况" prop="recordHealth">
          <el-radio v-model="record.recordHealth" label="健康">健康</el-radio>
          <el-radio v-model="record.recordHealth" label="亚健康">亚健康</el-radio>
          <el-radio v-model="record.recordHealth" label="较差">较差</el-radio>
        </el-form-item>
        <el-form-item label="遗传病史" prop="recordInherit">
          <el-radio v-model="record.recordInherit" label="无">无</el-radio>
          <el-radio v-model="record.recordInherit" label="有">有</el-radio>
        </el-form-item>
        <el-form-item label="遗传病详情" prop="recordInheritDetails" v-show="record.recordInherit == '有'">
          <el-input v-model="record.recordInheritDetails" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input v-model="record.remark" type="textarea" placeholder="请输入内容" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="recordDialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="insertRecord()">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getRegisterByCardId, queryRegisterListByUser, getRegisterById, endReg, doGuoHao } from '@/api/reghos-serv/register';
import { addPrescription } from '@/api/customer-serv/prescription';
import { goZhuYuan, addRecord } from '@/api/customer-serv/enter';

export default {
  data() {
    return {
      inheritFlag: false,
      registerList: [],
      recordDialogFormVisible: false,
      chufangDialogFormVisible: false,
      prescription: {
        patientId: "",
        patientName: "",
        registerId: "",
        depId: "",
        depName: "",
        userId: "",
        userName: "",
        rpMedicine: "",
        rpInspect: "",
        diagnosis: "",
        remark: ""
      },
      cardFlag: false,
      queryParams: {},
      patientCardId: "",
      register: {},
      registerId: "",
      record: {
        patientId: "",
        patientName: "",
        recordDesc: "",
        recordHealth: "",
        recordInfect: "",
        recordInfectDetails: "",
        recordAllergy: "",
        recordAllergyDetails: "",
        recordInherit: "无",
        recordInheritDetails: "",
        recordDate: "",
        remark: ""
      }
    };
  },
  created() {
    this.getRegisterList();
  },
  methods: {
    getRegisterList() {
      queryRegisterListByUser().then((result) => {
        this.registerList = result.data.registerList;
      });
    },
    handleQuery() {
      if (this.patientCardId == "") {
        this.$message.error("请输入查询身份证");
        return;
      }
      getRegisterByCardId(this.patientCardId).then((result) => {
        if (result.message == "no") {
          this.$message.error("未查询到挂号信息");
          this.cardFlag = false;
          return;
        }
        this.register = result.data.register;
        this.$message.success("查询成功");
        this.cardFlag = true;
      });
    },
    handleQuery2() {
      if (this.registerId == "") {
        this.$message.error("请输入挂号编号");
        return;
      }
      getRegisterById(this.registerId).then((result) => {
        if (result.message == "no") {
          this.$message.error("未查询到挂号信息");
          this.cardFlag = false;
          return;
        }
        this.register = result.data.register;
        this.$message.success("查询成功");
        this.cardFlag = true;
      });
    },
    addChufang() {
      this.prescription.patientId = this.register.patientId;
      this.prescription.patientName = this.register.patientName;
      this.prescription.registerId = this.register.registerId;
      this.prescription.depId = this.register.depId;
      this.prescription.depName = this.register.depName;
      this.prescription.userId = this.register.userId;
      this.prescription.userName = this.register.userName;
      this.chufangDialogFormVisible = true;
    },
    insertPrescription() {
      addPrescription(this.prescription).then((result) => {
        if (result.code == 200) {
          this.$message.success("开处方成功");
          this.chufangDialogFormVisible = false;
        }
      });
    },
    endRegister() {
      endReg(this.register.registerId).then((result) => {
        this.cardFlag = false;
        this.register = {};
        this.getRegisterList();
      });
    },
    endRegister2(registerId) {
      endReg(registerId).then((result) => {
        this.getRegisterList();
      });
    },
    guoHao(registerId) {
      doGuoHao(registerId).then((result) => {
        this.getRegisterList();
      });
    },
    zhuYuan() {
      goZhuYuan(this.register.registerId).then((result) => {
        if (result.message == "no") {
          this.$message.error("没有病历档案，请建立病历档案");
          this.record.patientId = this.register.patientId;
          this.record.patientName = this.register.patientName;
          this.recordDialogFormVisible = true;
          return;
        }
        if (result.message == "ok") {
          this.$message.success("住院单已生成");
        }
      });
    },
    insertRecord() {
      addRecord(this.record).then((result) => {
        this.$message.success("病历档案建立成功");
        this.recordDialogFormVisible = false;
      });
    }
  },
};
</script>

<style>
.el-row {
  margin-bottom: 20px;

  &:last-child {
    margin-bottom: 0;
  }
}

.el-col {
  border-radius: 4px;
}

.bg-purple-dark {
  background: #ffffff;
}

.bg-purple {
  background: #ffffff;
}

.bg-purple-light {
  background: #ffffff;
}

.grid-content {
  border-radius: 4px;
  min-height: 36px;
}

.row-bg {
  padding: 10px 0;
  background-color: #ffffff;
}
</style>